<template>
    <div class="loanSuccess">
        <div class="successTop">
            <img src="@/assets/back.png" alt="">
            <p class="pageName">Ứng dụng thành công</p>
            <p class="customerService"></p>
        </div>
        <div class="tip">
            <img src="@/assets/tipIcon.png" alt="">
            <p>Cảnh báo gian lận: Để đảm bảo an toàn tài chính của bạn, vui lòng không chuyển tiền của bạn sang bất kỳ
                tài khoản cá nhân hoặc tài khoản riêng nào trong thời gian thanh toán.</p>
        </div>

        <div class="successIcon"><img src="@/assets/successIcon.png" alt=""></div>

        <div class="waitTip">
            Chúng tôi đã nhận được đơn xin vay tiền của bạn và đang xử lý , vui lòng đợi.
        </div>

    </div>
</template>

<script setup lang='ts'>

</script>

<style lang="less" scoped>
.loanSuccess {
    height: 100%;
    background-color: #f7f7f9;
    padding: 0 .8rem;

    .successTop {
        height: 2.3rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: .6rem;

        &>img {
            display: block;
            width: 1.2rem;
            height: 1.2rem;
        }

        .pageName {
            font-weight: 600;
            font-size: 18px;
            color: #292B33;
            line-height: 26px;
            text-align: left;
            font-style: normal;
            text-transform: none;
        }

        .customerService {
            width: 1.2rem;
            height: 1.2rem;
        }

    }

    .tip {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        padding: .4rem .6rem;
        background-color: #FFF7EB;
        border: 1px solid #F1831D;
        border-radius: .2rem;
        margin-bottom: .5rem;

        &>img {
            display: block;
            width: 16px;
            height: 1.1rem;
            margin-right: .4rem;
        }

        &>p {
            font-family: SF Pro, SF Pro;
            font-weight: 400;
            font-size: 14px;
            color: #FF9326;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            text-transform: none;
        }
    }

    .successIcon {
        display: flex;
        justify-content: center;
        margin-bottom: 2.5rem;

        &>img {
            display: block;
            width: 5.4rem;
            height: 5.4rem;
        }
    }

    .waitTip {
        font-family: SF Pro, SF Pro;
        font-weight: 400;
        font-size: 14px;
        color: #626673;
        line-height: 22px;
        text-align: center;
        font-style: normal;
        text-transform: none;
    }
}
</style>